const images=[
        'http://p0.meituan.net/codeman/daa73310c9e57454dc97f0146640fd9f69772.jpg',
        'http://p1.meituan.net/codeman/826a5ed09dab49af658c34624d75491861404.jpg',
        'http://p0.meituan.net/codeman/a97baf515235f4c5a2b1323a741e577185048.jpg',
        'http://p0.meituan.net/codeman/33ff80dc00f832d697f3e20fc030799560495.jpg',
        'https://p1.meituan.net/travelcube/01d2ab1efac6e2b7adcfcdf57b8cb5481085686.png'
    ]
    let currentIndex=0
    let points=document.querySelectorAll('.pagin i')
    let con=document.querySelector('.con')
    let btn3=document.querySelector('.btn3')
    let btn4=document.querySelector('.btn4')
    let btn5=document.querySelector('.btn5')
    let btn6=document.querySelector('.btn6')
    let slide=document.querySelector('.slide')
    let swiper=document.querySelector('.swiper')
    btn3.onclick=function(){
      currentIndex--
      if(currentIndex<=0){
        currentIndex=images.length-1
      }
      slide.src=images[currentIndex]
      for(let j=0;j<points.length;j++){
        points[j].className=''
      }
      points[currentIndex].className='active'
    }
    btn4.onclick=function(){
      currentIndex++
      if(currentIndex>images.length-1){
        currentIndex=0
      }
      slide.src=images[currentIndex]
      for(let j=0;j<points.length;j++){
        points[j].className=''
      }
      points[currentIndex].className='active'
    }
    
    setInterval(()=>{
      currentIndex++
      if(currentIndex>=images.length){
        currentIndex=0
      }
      slide.src=images[currentIndex]
      for(let j=0;j<points.length;j++){
        points[j].className=''
      }
      points[currentIndex].className='active'
    },3000)
    

    swiper.onmouseover=()=>{
      btn3.style.display='block'
      btn4.style.display='block'
    }
    swiper.onmouseout=()=>{
      btn3.style.display='none'
      btn4.style.display='none'
    }

    con.onmouseover=()=>{
      btn5.style.display='block'
      btn6.style.display='block'
    }
    con.onmouseout=()=>{
      btn5.style.display='none'
      btn6.style.display='none'
    }